<template>
	<div id="PageCom">
		<TopList :toplist="toplist"></TopList>
		<!-- 首页商品列表  :HomeCommodity -->
		<CommodityItem :HomeCommodity="list"></CommodityItem>
	</div>
</template>

<script>
	// 首页商品列表
	import CommodityItem from '@/components/home/CommodityItem.vue'
	import TopList from '@/components/home/ComTopList.vue'
	// <!-- 导入api文件 -->
	import {
		CommodityList,
		ComTopList
	} from "@/api/home"
	export default {
		components: {
			// 首页商品列表
			CommodityItem,
			TopList
		},
		props: {
			title: {
				typeof: Number,
				default: () => {
					return 0
				}
			},
		},
		data() {
			return {
				list: [],
				toplist: [],
				shenglue: {
					cate_name: "更多",
					pic: require("@/assets/shenglue.png")
				}
			}
		},
		created() {
			CommodityList(this.title).then(res => {
				this.list = res.data.data.list
			})
			ComTopList(this.title).then(res => {
				this.toplist = res.data.data
				if (this.toplist.length > 10) {
					this.toplist = this.toplist.slice(0, 9)
					this.toplist.push(this.shenglue)
				}
			})
		}
	}
</script>

<style>
	#PageCom {
		width: 100vw;
	}
</style>
